<template>
  <!-- 意向车型需求信息 -->
  <!-- <div style="height:520px;"> -->
      <div>
    <FilterTable
      ref="table"
      height="450"
      :columns="columns"
      :fetchapi="fetchApi"
      :isSelectColumn="isSelectColumn"
      :params="fetchParams"
      :datakey="'records'"
      columnsRef='customerManage_continueManage_record_infoCarShow_01'
      :isPagination="isPagination"
      :onColumnsChange="columns => this.columns = columns"
    ></FilterTable>

    <!-- 物料选择测试 -->
    <BaseDialog
      title="物料选择"
      width="700px"
      destroyOnClose
      :visible.sync="visibleProduct"
      :containerStyle="{height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}"
    >
      <productDlg ref="productDlg" @close="closeProduct" />
    </BaseDialog>

    <!-- 编辑 -->
    <BaseDialog
      title="更新车辆信息"
      width="700px"
      destroyOnClose
      :visible.sync="visibleCarInfo"
      :containerStyle="{height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}"
    >
      <carInfoDlg ref="carInfoDlg" :rowData="formData" @close="closeCarInfo" />
    </BaseDialog>
  </div>
</template>
<script>
import { dictionary } from '@/utils/dictMixin';
import { carInfo } from '@/api/cms-api/customerManage/continueManage/record/index';
import { addCarInfo } from '@/api/cms-api/customerManage/continueManage/record/index';
import { delCarInfo } from '@/api/cms-api/customerManage/continueManage/record/index';
import productDlg from '@/pages/cms-common/product'; //物料选择
import carInfoDlg from '@/pages/cms-pages/customerManage/continueManage/record/carInfoEdit'; //编辑车辆
import { formatdateByTime } from '@/utils/index';
import { formatdateByDay } from '@/utils/index';
export default {
  mixins: [dictionary],
  components: {
    productDlg,
    carInfoDlg
  },
  props: {
    value: {
      type: Number,
      required: true
    },
    infoBasic: {
      type: String,
      required: true
    }
  },
  data() {
    return {
      isSelectColumn: false,
      flterValue: {}, //参数
      fetchApi: carInfo, //ipa 接口
      isPagination: false,
      visibleProduct: false, //测试
      visibleCarInfo: false,
      formData: {},
      columns: this.creatHeader(),
      fetchParams: { projectId: this.value } //ipa 接口
    };
  },
  created() {
    this.init();
  },
  methods: {
    formatDates: function(value) {
      // 这里的 value 就是需要过滤的数据
      if (value == null || value == '') {
        return '';
      }
      var date = new Date(value);
      var year = date.getFullYear();
      var month = date.getMonth() + 1;
      var day = date.getDate();
      return year + '-' + month + '-' + day;
    },
    //关闭详情
    closeCarInfo(val, type) {
      this.visibleCarInfo = false;
      this.fetchParams = { ...this.fetchParams };
    },
    editHandle(row) {
      console.log(row);
      this.formData = row;
      this.visibleCarInfo = true;
    },
    async del(projectModelId) {
      this.res = await delCarInfo(projectModelId);
      this.fetchParams = { ...this.fetchParams };
    },
    deleHandle(projectModelId) {
      this.del(projectModelId);
    },
    async saveDialog(data, projectId) {
      this.res = await addCarInfo(data, projectId);
      this.fetchParams = { ...this.fetchParams }; //刷新
      this.visibleProduct = false; //测试
    },
    closeProduct(data) {
      console.log(data);
      this.saveDialog(data.data, this.value);
    },
    productHandle() {
      this.visibleProduct = true;
    },
    //初始化数据
    init() {
      console.log('行id---->', this.value);
      console.log('是否编辑---->', this.infoBasic);
      //赋值
      // this.initForm.forEach(x => {
      //     x.initialValue = data.row[x.fieldName];
      // });
    },
    //table表头和数据源
    creatHeader() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        { title: '整车编码', dataIndex: 'productCode', sorter: true },
        { title: '产品名称', dataIndex: 'productName', sorter: true },
        { title: '车型名称', dataIndex: 'modelName', sorter: true },
        { title: '数量（台）', dataIndex: 'vehicleNum', sorter: true },
        {
          title: '预计交车时间',
          dataIndex: 'planDate',
          sorter: true,
          render: props => {
            return <span>{formatdateByDay(props.row.planDate)} </span>;
          }
        },
        { title: '其它情况说明', dataIndex: 'otherDesc', sorter: true }
        // { title: '预计交车时间', dataIndex: 'planDate', sorter: true, editable: false, defaultEditable: true, editType: 'date-picker' },
        // { title: '其它情况说明', dataIndex: 'otherDesc', sorter: true, editable: false, defaultEditable: true, editType: 'text' }
      ];
    }
  }
};
</script>

<style lang="less" scoped>
</style>
